<template>
  <div class="contentWeb clear">
    <div class="member_menu">
      <Memleft active="memLike"/>
    </div>
    <div class="member_right">
      <div class="none_mem" v-if="total * 1 === 0">
        <div style="padding-bottom: 70px;" class="clear">
          <img :src="nonoe" class="noneimg">
          <div>
            你还没有收藏信息
          </div>
        </div>
      </div>
     <div  v-if="total * 1 > 0">
       <div class="listcount">共收藏了<span>{{total}}个职位</span></div>
       <div class="jobtab clear" v-for="(item, index) in ListList" :key="index" >
         <div class="clear">
           <div class="zwname" @click="toInfo(item.positionId)">{{item.positionName}}</div>
           <div class="gsinfo" @click="tocompany(index)">
             <img :src="item.logo"/><b>{{item.companyName}}</b>
           </div>
         </div>
         <div class="clear">
           <div class="jieshao">
             <b>{{item.wageRange}}</b>
             <span>{{item.workYears}}年经验</span>
             <span>{{item.educational}}</span>
             <span>招{{item.zprs}}人</span>
           </div>
           <div class="gsjj">
             <span v-if="item.industry">{{item.industry}}</span><span v-if="item.enterpriseNature">{{item.enterpriseNature}}</span>
             <span v-if="item.companySize">{{item.companySize}}</span>
           </div>
         </div>
         <div class="clear">
           <div style="float: left" v-html="welfareRemarkhtml(item.welfareRemark)"></div>
           <div style="float: right">
             <div class="cancelbtn" @click="cancleCollection(item.id)">取消收藏</div>

           </div>
         </div>

       </div>
       <div style="text-align: center">
         <el-pagination background layout="prev, pager, next"
         @current-change="getpost"
         :current-page="search.pageNum"
         :page-size="search.pageSize"
         :total="total"></el-pagination>
       </div>
     </div>
    </div>
  </div>
</template>
<script type="text/babel">
// @ is an alias to /src
import Memleft from '../../components/memleft'
import { getMyCollectionList, cancleMyCollection } from '../../assets/js/domains'
import nonoe from '../../assets/img/weijian.png'
export default {
  name: 'MemLike',
  components: { Memleft },
  directives: {},
  data: function () {
    return {
      total: 0,
      nonoe: nonoe,
      ListList: [],
      search: { pageNum: 1, pageSize: 10, user_uid: '' }
    }
  },
  created: function () {
    document.documentElement.scrollTop = document.body.scrollTop = 0
    this.search.user_uid = localStorage.getItem('md_user_uid')
  },
  computed: {},
  mounted: function () {
    this.getpost()
  },
  methods: {
    welfareRemarkhtml: function (item) {
      if (item) {
        const mp = item.split(',')
        let htmls = ''
        for (let i = 0; i < mp.length; i++) {
          htmls = htmls + ' <div style="height: 36px;line-height: 34px;background: #f6f6f8;border: 1px solid #f6f6f8;border-radius: 6px;padding: 0 15px;font-size: 16px;float: left;margin-right: 10px;margin-top: 5px;">' + mp[i] + '</div>'
        }

        return htmls
      } else {
        return ''
      }
    },
    add: function () {
    },
    getpost: function (page) {
      if (page) {
        this.search.pageNum = page
      }
      const _this = this
      getMyCollectionList(this.search).then(function (res) {
        if (res.code === 200) {
          _this.ListList = res.data.content
          _this.total = res.data.totalElements
        }
      })
    },
    cancleCollection: function (id) {
      const _this = this
      _this.$confirm('将取消该收藏, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(function () {
        cancleMyCollection({ collection_id: id }).then(function (res) {
          if (res.code === 200) {
            _this.getpost(1)
          } else {
            _this.$message({
              type: 'error',
              message: res.msg
            })
          }
        })
      }).catch(function () {
        _this.$message({
          type: 'info',
          message: '已取消'
        })
      })
    },
    toInfo: function (id) {
      window.location.href = 'jobDetail.html?id=' + id
    }

  }
}
</script>
<style lang="less" scoped>
  @import "../../assets/css/member";
</style>
